<template>
  <view class="newStyle">
    <view class="contentTotle">{{ list.newsContentTitle }}</view>
    <view v-for="item,index in imgData" :key="index">
      <img :src="item" alt=""/>
    </view>
    <p v-html="list.newsContentDescribe"></p>
  </view>
</template>

<script>
import { newsContent } from '@/api/home/homePage'

export default {
  data() {
    return {
      list: [],
      flag: '',
      userId: this.$store.userStore.userInfo.id,
      imgData: []
    }
  },
  onLoad(options) {
    this.getNewsContent(options.id)
  },
  methods: {
    getNewsContent(id) {
      newsContent(id, this.userId).then(res => {
        this.list = res.data.data
        this.imgData = this.list.img.split(',')
      })
    }
  }
}
</script>

<style scoped>
.newStyle {
  text-align: center;
}

.newStyle p {
  width: 95%;
  margin: 0 auto;
}

.newStyle img {
  width: 90%;
}

.contentTotle {
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  color: #252631;
  letter-spacing: 4px;
}

.newStyle p :deep(img) {
  width: 95%;
}
</style>
